<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 内部样式表 -->
    <style>
        /* 通过 id选择器 给对应的标签设置样式 */
        /* 一般不用于设置样式 留给DOM来用 */
        #div2 {
            color: blue;
        }

        /* 类选择器 */
        .div2 {
            background-color: yellow;
        }
    </style>
</head>

<body>
    <!-- 核⼼四大属性（绝⼤多数标签都具有的属性）：title、id、class、style -->
    <!-- title 类似于一个悬浮提示 -->
    <div title="我是一个div">我是一个div</div>

    <!-- id id选择器 # 设置成独一无二的值 -->
    <div id="div2">div2</div>

    <!-- 快捷写法：div#div3 -->
    <div id="div3">div3</div>

    <!-- class 类选择器 . 可以重复的 -->
    <!-- 快捷写法：div.div4 -->
    <div class="div4">div4</div>

    <!-- 内联样式 -->
    <div style="font-size: 20px;">div5</div>
</body>

</html>